<script lang="ts" setup>
// 引入vue
import { defineProps } from "vue"
// 获取参数
const { title, show } = defineProps(['title', 'show'])
</script>


<template>
    <div class="title" v-if="show">
        {{ title }}
        <div w50rem h18rem flex justify-center items-center bg-dark>
            <dv-decoration2 :dur="5" style="width:200px;height:10px;" />
        </div>
    </div>
    <div class="righttitle" v-else>
        {{ title }}
    </div>
</template>

<style scoped lang="scss">
.title {
    width: 100%;
    height: 30px;
    line-height: 30px;
    font-weight: bold;
    font-size: 14px;
    padding-left: 15px;
    box-sizing: border-box;
    margin-bottom: 10px;
    background: url(@/assets/layout/左.png) no-repeat 0 0 / 100% 100%;
    color: #9cb0fa;
    position: relative;

    >div {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
}


.righttitle {
    width: 100%;
    font-weight: bold;
    font-size: 14px;
    height: 30px;
    margin-bottom: 10px;
    background: url(@/assets/layout/右.png) no-repeat 0 0 / 100% 100%;
    color: #9cb0fa;
    padding-left: 20px;
    line-height: 30px;
    box-sizing: border-box;
}
</style>